<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>公司信息</title>
    <!-- vue -->
    <script src="../common/js/vue2.js"></script>
    <!-- 引入通用css -->
    <link rel="stylesheet" href="../common/public.css" />
    <!-- 引入样式vant -->
    <link rel="stylesheet" href="../common/ui/vant-ui/ui.css" />
    <script src="../common/ui/vant-ui/ui.js"></script>
    <!-- 引入http-vue-loader -->
    <script src="../common/js/vueLoader.js"></script>
  </head>
  <body>
    <div id="app">
      <main-top></main-top>
      <div class="mainCenter">
        <div class="leftContent">
          <div class="pd10 flex jcsb">
            <div class="ndis500"><van-icon name="arrow-left" size="20" /></div>
            <div class="dis500"></div>
            <div class="cr fwb">公司信息</div>
            <div></div>
          </div>
          <div class="flex jcc">
            <div class="topbd flex jcsb aic">
              <div class="c9 witer">完善2项信息,主页查看率最高可提升20%</div>
              <div class="mtag">去完善</div>
            </div>
          </div>
    
          <div class="pd20">
            <div v-for="(i,index1) in fl">
              <div>
                <div class="fwb mgt20 mgb20 flex jcsb">
                  <div>{{ i.type }} <span v-if="i.list.length>1">{{ isCh(i.list) }}/{{ i.list.length }}</span></div>
                  <div v-if="i.list.length>1">
                    <div><van-icon :name="i.show?'arrow-up':'arrow-down'" @click="i.show = !i.show"/></div>
                  </div>
                  <div class="fs12 flex aic" v-else>
                    <div class="mgr8" :class="isHave(i)?'c9':'c0'" @click="topage(i.list[0].url)">{{  isHave(i)?isHave(i):'去添加' }}</div>
                    <div><van-icon name="arrow" size="14"/></div>
                  </div>
                </div>
                <div v-for="(j,index2) in i.list" v-if="i.list.length>1&&i.show">
                  <van-cell :title="j.name" title-class="fwb fs14 flex aic">
                    <template #title>
                      {{ j.name }}&nbsp; <span class="sstag lkColor" v-if="j.important">重要</span>
                    </template>
                    <template #right-icon>
                      <div v-if="j.rightIcon"><van-icon :name="j.rightIcon" size="30"/></div>
                      <div class="mgr8 c9" v-if="j.rightTxt">{{ j.rightTxt }}</div>
                      <div v-else v-show="!j.rightIcon"> 去添加</div>
                      <div class="c9" @click="topage(j.url)">
                        <span v-if="!j.isLock"><van-icon name="arrow" /></span>
                        <span  v-else><van-icon name="star-o"/></span>
                      </div>
                    </template>
                  </van-cell>
                </div>
              </div>
            </div>
            <div class="fs12 c9 tac mgt10">点击此处反馈问题<van-icon name="arrow" /></div>
          </div>
        </div>
        <lan-adright></lan-adright>
      </div>
      <main-footer class="bd"></main-footer>
    </div>
  </body>
</html>
<style>
  body {
    background-color: #fff;
  }
  .topbd {
    font-size: 12px;
    width: 320px;
    border: 1px solid #999;
    border-top: none;
    border-radius: 0 0 10px 10px;
    padding: 5px 10px;
  }
  .witer{
    width: 240px;
  }
  .sstag{
    font-size: 12px;
    padding: 0 4px;
    transform: scale(0.9);
    border-radius: 5px;
  }
</style>
<script>
  new Vue({
    el: "#app",
    data: {
      fl: [
        {
          type: '基本信息',
          show:true,
          list: [
            { name: "品牌Logo", rightIcon: "search" },
            { name: "品牌名称", rightTxt: "xyt"},
            { name: "全称", rightTxt: "阳江xxxxxx", isLock: true },
            { name: "行业", rightTxt: "互联网"},
            { name: "融资阶段", rightTxt: "不需要融资"},
            { name: "人员规模", rightTxt: "0-20人"},
          ],
        },
        {
          type: '公司福利',
          show:true,
          list: [
            { name: "标准工作时间", rightTxt: "上午08:30-下午06:00"},
            { name: "福利待遇", rightTxt: "已添加8项",url:'./fl.html'},
          ],
        },
        {
          type: '公司介绍',
          show:true,
          list: [
            { name: "公司介绍", rightTxt: "已添加"}
          ],
        },
        {
          type: '主营业务',
          show:true,
          list: [
            { name: "主营业务"}
          ],
        },
        {
          type: '公司相册',
          show:true,
          list: [
            { name: "VR实景照片", rightTxt: "",important:true},
            { name: "公司照片", rightTxt: "已添加1张"},
          ],
        },
        {
          type: '人才发展',
          show:true,
          list: [
            { name: "人才发展", rightTxt: "已添加5项",url:'./gsfz.html'},
          ],
        },
        {
          type: '在职感受',
          show:true,
          list: [
            { name: "在职感受", rightTxt: "已添加"}
          ],
        },
        {
          type: '产品介绍',
          show:true,
          list: [
            { name: "产品介绍", rightTxt: "",url:'./shopTell.html'}
          ],
        },
        {
          type: '高管介绍',
          show:true,
          list: [
            { name: "高管介绍", rightTxt: "",url:'./heightMan.html'}
          ],
        },
      ],
    },
    components: {
      "main-top": httpVueLoader("../common/commpent/main/workTop.vue"),
      "main-footer": httpVueLoader("../common/commpent/main/mainFooter.vue"),
      "lan-adright": httpVueLoader("../common/commpent/lan/adRight.vue"),
    },
    methods: {
      isCh(list){
        return list.filter(i=>i.rightTxt||i.rightIcon).length;
      },
      isHave(msg){
        if(msg.list[0].rightTxt){
          return msg.list[0].rightTxt
        }else {
          return false
        }
      },
      topage(url){
        if(url){
          window.location.href = url;
        }
      }
    },
  });
</script>
